<template>
  <el-popover v-bind="$attrs" :trigger="trigger || ''">
    <template #reference>
      <slot name="reference">{{ title }}<i v-if="iconFont" class="font-family" :class="iconFont" /></slot>
      <div></div>
    </template>
    <slot name="content">
      <div>
        <FIInput v-model="searchValue" class="w-50 m-2" size="large" placeholder="Please Input" :prefix-icon="Search" />
      </div>
    </slot>
  </el-popover>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { Search } from '@element-plus/icons-vue'
import FIInput from './FIInput.vue'
const props = defineProps({
  trigger: {
    type: String,
    default: 'click',
  },
  title: {
    type: String,
    default: '',
  },
  iconFont: {
    type: String,
    default: 'icon-zhankaiquanbu',
  },
  // 出现位置top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end
  placement: {
    type: String,
    default: 'bottom',
  },
  filterList: {
    type: Array,
    default: () => {
      return []
    },
  },
})
// 搜索内容
const searchValue = ref('')
</script>
